<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="description" content="对网页的一段概括性描述" />
		<meta name="keywords" content="关键字1,关键字2,关键字3..." />
		<!-- 在双核浏览器下，默认使用webkit内核，由360浏览器提出 -->
		<meta name="renderer" content="webkit">
		<title></title>
		<link rel="shortcut icon" href="" />
		<!-- 强大的CSS Reset库 -->
		<!--<link href="http://cdn.bootcss.com/normalize/5.0.0/normalize.css" rel="stylesheet">-->
		<!-- 让IE9以下的浏览器支持HTML5标签 -->
		<!--[if lt IE 9]><script src="http://cdn.bootcss.com/html5shiv/r29/html5.js"></script><![endif]-->
		<link rel="stylesheet" href="font/css/font-awesome.min.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/enjoy.css" />
		<link rel="stylesheet" type="text/css" href="css/passage.css" />
	</head>
	<body>
		<!--注册-->
		<section class="jw-zhuce" id="zhuce">
			<div class="jw-zhuce-content">
				<a class="close">
					<i class="fa fa-times" id="close"></i>
				</a>
				<div class="jw-zhuce-content-form">
					<div id="register-active" class="switch">
						<i class="fa fa-toggle-on"></i> 切换登陆
					</div>
					<h3>注册<p class="status"></p></h3>
					<p>
						<label class="icon" for="user_name"><i class="fa fa-user"></i></label>
						<input class="input-control" id="user_name" type="text" name="user_name" placeholder="输入英文用户名" required="" aria-required="true">
					</p>
					<p>
						<label class="icon" for="user_email"><i class="fa fa-envelope"></i></label>
						<input class="input-control" id="user_email" type="text" name="user_email" placeholder="输入常用邮箱" required="" aria-required="true">
					</p>
					<p>
						<label class="icon" for="user_pass"><i class="fa fa-lock"></i></label>
						<input class="input-control" id="user_pass" type="password" name="user_pass" placeholder="密码最小长度为6" required="" aria-required="true">
					</p>
					<p>
						<label class="icon" for="user_pass2"><i class="fa fa-retweet"></i></label>
						<input class="input-control" type="password" id="user_pass2" name="user_pass2" placeholder="再次输入密码" required="" aria-required="true">
					</p>
					<p class="safe">
						<label class="remembermetext" for="rememberme">
							<input name="rememberme" type="checkbox" checked="checked" id="rememberme" >记住我的登录
						</label>
						<a class="lost" href="#">忘记密码？</a>
					</p>
					<p>
						<input class="submit" type="reset" value="注册" name="submit">
					</p>
				</div>
				<div class="other-sign">
					<p>您也可以使用第三方帐号登录</p>
					<div class="qqlogin">
						<a rel="nofollow" href="#">
							<i class="fa fa-qq"></i> QQ帐号登录
						</a>
					</div>
				</div>
			</div>
		</section>
		<!--登陆-->
		<section class="jw-denglu" id="denglu">
			<div class="jw-denglu-content">
				<a class="close">
					<i class="fa fa-times" id="clos"></i>
				</a>
				<div class="jw-denglu-content-form">
					<div id="register-active" class="switch">
						<i class="fa fa-toggle-on"></i> 切换注册
					</div>
					<h3>登录<p class="status"></p></h3>
					<p>
						<label class="icon" for="username"><i class="fa fa-user"></i></label>
						<input class="input-control" id="username" type="text" placeholder="请输入用户名或邮箱" name="username" required="" aria-required="true">
					</p>
					<p>
						<label class="icon" for="password"><i class="fa fa-lock"></i></label>
						<input class="input-control" id="password" type="password" placeholder="请输入密码" name="password" required="" aria-required="true">
					</p>
					<p class="safe">
						<label class="remembermetext" for="rememberme">
							<input name="rememberme" type="checkbox" checked="checked" id="rememberme" >记住我的登录
						</label>
						<a class="lost" href="#">忘记密码？</a>
					</p>
					<p>
						<input class="submit" type="submit" value="登录" name="submit">
					</p>
				</div>
				<div class="other-sign">
					<p>您也可以使用第三方帐号登录</p>
					<div class="qqlogin">
						<a rel="nofollow" href="#">
							<i class="fa fa-qq"></i> QQ帐号登录
						</a>
					</div>
				</div>
			</div>
		</section>
		<!--指定-->
		<aside class="jw-aside-top" id="scroll">
			^
		</aside>

		<header class="jw-header" id="topbar">
			<div class="jw-comWidth1">
				<div class="jw-header-logo fl">
					<a href="index.html"><img src="img/logo.png" height="50px" /></a>
				</div>
				<ul class="jw-header-nav fl">
					<li class="fl">
						<a href="passage.html" style="color: rgba(255, 255, 255, 0.5);">文章</a>
					</li>
					<li class="fl">
						<a href="enjoy.html">欣赏</a>
					</li>
					<li class="fl">
						<a href="source.html">素材</a>
					</li>
					<li class="fl">
						<a href="change.html">兑换</a>
					</li>
					<li class="fl">
						<a href="active.html">活动</a>
					</li>
					<li class="fl">
						<a href="Fantastic.html">唯然</a>
					</li>
					<li class="fl" id="show">
						<a href="add.html">更多</a>
						<ul class="sub-menu" id="cloo">
							<li>
								<a href="add.html">关于觉唯</a>
							</li>
							<li>
								<a href="adda.html">留言联系</a>
							</li>
						</ul>
					</li>
				</ul>
				<script type="text/javascript">
					var show = document.getElementById('show');
					var cloo = document.getElementById('cloo');

					show.onmouseover = function() {
						cloo.style.display = 'block';
					}
					show.onmouseout = function() {
						cloo.style.display = 'none';
					}

					cloo.onmouseover = function() {
						cloo.style.display = 'block';
					}
					cloo.onmouseout = function() {
						cloo.style.display = 'none';
					}
				</script>
				<div class="jw-header-reg fr">
					<a href="#" id="deng">登录</a>
					<a href="#" id="zhu">注册</a>
				</div>
				<div class="jw-header-search fr">
					<input type="text" />
					<span class="search-icon">
    					<i class="fa fa-search"></i>
    				</span>
				</div>
			</div>
			<ul class="jw-header-phone">
				<ul class="jw-header-phone-menu-nav">
					<li>
						<a href="#">首页</a>
					</li>
					<li>
						<a href="#">文章</a>
					</li>
					<li>
						<a href="#">欣赏</a>
					</li>
					<li>
						<a href="#">素材</a>
					</li>
					<li>
						<a href="#">兑换</a>
					</li>
					<li>
						<a href="#">活动</a>
					</li>
					<li>
						<a href="#">唯然</a>
					</li>
					<li>
						<a href="#">更多</a>
					</li>
				</ul>
				<li>
					<a href="#" class="jw-header-phone-menu">
						<i class="fa fa-bars"></i>
					</a>

				</li>
				<li>
					<a href="#" class="jw-header-phone-logo">
						<img src="img/logo-phone.png" height="50px" />
					</a>
				</li>
				<li>
					<a href="#" class="jw-header-phone-user">
						<i class="fa fa-user"></i>
					</a>
				</li>
			</ul>
		</header>
		<section class="jw-xs-header" class="clearfix">
			<div class="jw-xs-header-content">
				<div class="jw-xs-header-content-text1">
					<i class="fa fa-bookmark"></i>
					不限类别
					<ul class="sub">
						<li>
							<a href="#">一周内</a>
						</li>
						<li>
							<a href="#">一月内</a>
						</li>
						<li>
							<a href="#">一年内</a>
						</li>
					</ul>
					<i class="fa fa-caret-down arrow"></i>
				</div>
				<div class="jw-xs-header-content-text2">
					<i class="fa fa-sort"></i>
					最新发布
					<ul class="sub">
						<li>
							<a href="#">一周内</a>
						</li>
						<li>
							<a href="#">一月内</a>
						</li>
						<li>
							<a href="#">一年内</a>
						</li>
					</ul>
					<i class="fa fa-caret-down arrow"></i>
				</div>
				<div class="jw-xs-header-content-text3">
					<i class="fa fa-clock-o"></i>
					不限时间
					<ul class="sub">
						<li>
							<a href="#">一周内</a>
						</li>
						<li>
							<a href="#">一月内</a>
						</li>
						<li>
							<a href="#">一年内</a>
						</li>
					</ul>
					<i class="fa fa-caret-down arrow"></i>
				</div>
			</div>
		</section>
		<section class="jw-wen-wid">
			<div class="jw-wen">
				<div class="jw-wen-left">
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/wen1.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/9.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao8.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao7.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao6.jpg"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao5.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao4.jpg"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao2.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao3.gif"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao12.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao11.png"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="jw-wen-left-content">
						<div class="jw-wen-left-wid">
							<div class="jw-wen-left-content-pic">
								<a href="#"><img src="img/xiao10.jpg"/></a>
							</div>
							<div class="jw-wen-left-content-text">
								<div class="jw-wen-left-content-textT">
									<div class="jwl-content-textT-txt">
										<h2>
											<a class="txt1" href="#">[推荐]&nbsp;玩转H5下拉上滑动效</a>
										</h2>
										<a href="#" class="txt2" >前端开发</a>
										<span class="tag-links">
	            						  	<a href="#" rel="tag">css</a>
	              							 - 
	              							 <a href="#" rel="tag">HTML5</a> 
	              							 - 
	              							 <a href="#" rel="tag">动效</a>             
										</span>
									</div>
									<div class="jwl-content-textT-pic">
										<img src="img/xiao1.png"/>
									</div>
								</div>
								<div class="jw-wen-left-content-textB">
									<div class="excerpt">
				   						在APP中我们经常会在页面下拉时看到一些动效，例如下拉图片跟随放大、下拉刷新出现loading动画等，这个交互细节在各个主流APP以及手机原生系统中随处可见，能为APP增添...         
									</div>
									<time class="time">
	             						 <i class="fa fa-calendar"></i> 
	             						 Javin 发布于   2016-08-25             
									</time>
									<div class="textB-xiao">
										<span class="heart-num"><i class="fa fa-heart"></i>12</span>
										<span><i class="fa fa-fire"></i>1114</span>
										<span class="comment-num">
		             			 			<a href="http://www.jiawin.com/h5-drop-down-effect-slide#comments" class="comments-link"><i class="fa fa-comment"></i>4</a>  
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="jw-wen-right">
					<div class="jw-wen-right-con1">
						<h3 class="widget-title">
							<i class="fa fa-file-archive-o"></i>
							30天热门
						</h3>
					</div>
					<div class="jw-wen-right-con2">
						<div class="jw-wen-right-con2-pic">
							<img src="img/广告1.png"/>
						</div>
					</div>
					<div class="jw-wen-right-con3">
						<div class="jw-wen-right-con3-txt">
							<h3 class="widget-title">
								<i class="fa fa-comments-o"></i>
								最新评论
							</h3>
							<ul>
								<li>
									<a href="#">
										<div class="jwr-con3-txt-cont">
											<div class="thumb">
												<img src="img/100.jpg" class="avatar">
											</div>
											<p>
												<strong>微微一笑。。</strong><br/><br/>
												<span>赞，</span>
											</p>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="jwr-con3-txt-cont">
											<div class="thumb">
												<img src="img/100.jpg" class="avatar">
											</div>
											<p>
												<strong>微微一笑。。</strong><br/><br/>
												<span>还不错，所有的图片都比较简洁</span>
											</p>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="jwr-con3-txt-cont">
											<div class="thumb">
												<img src="img/100.jpg" class="avatar">
											</div>
											<p>
												<strong>微微一笑。。</strong><br/><br/>
												<span>:!:</span>
											</p>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="jwr-con3-txt-cont">
											<div class="thumb">
												<img src="img/100.jpg" class="avatar">
											</div>
											<p>
												<strong>微微一笑。。</strong><br/><br/>
												<span>:grin:</span>
											</p>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="jwr-con3-txt-cont">
											<div class="thumb">
												<img src="img/100.jpg" class="avatar">
											</div>
											<p>
												<strong>微微一笑。。</strong><br/><br/>
												<span>美食</span>
											</p>
										</div>
									</a>
								</li>
							</ul>
						</div>
					</div>
					<div class="jw-wen-right-con4">
						<div class="jw-wen-right-con2-pic">
							<img src="img/广告2.png"/>
						</div>
					</div>
					<div class="jw-wen-right-con5">
						<div class="jw-wen-right-con2-pic">
							<img src="img/广告3.png"/>
						</div>
					</div>
				</div>
			</div>
		</section>
		
			<footer class="jw-footer clearfix">
			<div class="jw-comWidth clearfix">
				<aside class="group describe">
					<h3>觉唯</h3>
					<p>以用户为中心的设计理念，专注于用户体验设计，拥有国内外最新的设计潮流趋势、独特而美的创意视觉、新颖而灵敏的思维意识、极致而生动的交互体验，更有严谨而通俗的技术教程！ 唯然是觉唯网的图片分享社区，以记录美丽、分享美好的创意理念，分享高品质创意、艺术、设计、时尚、插画、摄影、唯美类精美图片。
					</p>
				</aside>
				<aside class="group">
					<dl>
						<dt>关于</dt>
						<dd>
							<a href="#">关于觉唯</a>
							<a href="#">留言联系</a>
							<a href="#">友情链接</a>
							<a href="#">免责声明</a>
							<a href="#">网站地图</a>
						</dd>
					</dl>
				</aside>
				<aside class="group">
					<dl>
						<dt>关于</dt>
						<dd>
							<a href="#">关于觉唯</a>
							<a href="#">留言联系</a>
							<a href="#">友情链接</a>
							<a href="#">免责声明</a>
							<a href="#">网站地图</a>
						</dd>
					</dl>
				</aside>
				<aside class="group">
					<dl>
						<dt>关于</dt>
						<dd>
							<a href="#">关于觉唯</a>
							<a href="#">留言联系</a>
							<a href="#">友情链接</a>
							<a href="#">免责声明</a>
							<a href="#">网站地图</a>
						</dd>
					</dl>
				</aside>
				<aside class="group social">
					<h3>关注</h3>
					<ul>
						<li>Email:<a href="#">javin@jiawin.com</a></li>
						<li>
							<input type="text" placeholder="请输入邮箱地址" />
							<button>订阅</button>
						</li>
						<li class="social-icon clearfix">
							<a href="#">
								<i class="fa fa-weibo"></i>
							</a>
							<a href="#">
								<i class="fa fa-tencent-weibo"></i>
							</a>
							<a href="#">
								<i class="fa fa-qq"></i>
							</a>
							<a href="#">
								<i class="fa fa-rss"></i>
							</a>
							<a href="#">
								<i class="fa fa-weixin"></i>
							</a>
						</li>
					</ul>
				</aside>
				<p class="copyRight clearfix">Copyright © 2012-2016
					<a href="#">觉唯设计</a> Theme by
					<a href="#">Javin zhong</a> All All Rights Reserved. 粤ICP备12073831号-1</p>
			</div>
		</footer>
		<script type="text/javascript">
			var obj = document.getElementById("scroll");
			var scrollTop = null;
			obj.onclick = function() {
				var timer = setInterval(function() {
					var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
					window.scrollBy(0, -100);
					if(scrollTop == 0) {
						clearInterval(timer);
					}
				}, 20);
			}
		</script>
		<!--注册-->
		<script type="text/javascript">				
				var close = document.getElementById("close");
				close.onclick = function() {
					document.getElementById("zhuce").style.display = 'none';
				}
				var zhu = document.getElementById("zhu");
				zhu.onclick = function() {
					document.getElementById("zhuce").style.display = 'block';
				}
		</script>
		<!--登录-->
		<script type="text/javascript">
			var clos = document.getElementById("clos");
				clos.onclick = function() {
					document.getElementById("denglu").style.display = 'none';
				}
				var deng = document.getElementById("deng");
				deng.onclick = function() {
					document.getElementById("denglu").style.display = 'block';
				}
		</script>
	</body>
</html>
